<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/index.css" />
		<link rel="stylesheet" href="css/3x3-2.css" />
		<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
		<style>
			.body {
				width: 5760px;
				height: 3240px;
				display: flex;
				flex-wrap: wrap;
				transform: scale(0.333);
			    transform-origin:0 0;
			    -ms-transform: scale(0.333);         /* IE 9 */
			    -ms-transform-origin:0 0;
			    -webkit-transform: scale(0.333); /* Safari 和 Chrome */
			    -webkit-transform-origin:0 0;
			    -moz-transform: scale(0.333);        /* Firefox */
			    -moz-transform-origin:0 0;
			    -o-transform: scale(0.333);      /* Opera */
			    -o-transform-origin:0 0;
			}
			body{
				width: 1920px;
				height: 1080px;
				background: url(img/bg.png) no-repeat;
			}
		</style>
	</head>

	<body>
	<div class="body">
		<div class="box">
			<div class="bt">智慧水务</div>
			<img src="img/智慧水务.png" width="100%" style="margin-top: 20px;" />
		</div>
		<div class="box">
			<div class="bt">智慧教育</div>
			<div class="box-jy-top">
       			<div id="ech_n_9" style="height: 100%;"></div>
       			<div class="box-jy-top-flex">
       				<div style="position: absolute;left: 100px;top: 0;">
	       				<p>在园幼儿<b>21.65</b>万人</p>
	       			</div>
       				<div style="position: absolute;left: 445px;top: 0;">
	       				<p>在校生<b>45.34</b>万人</p>
	       			</div>
       				<div style="position: absolute;left: 750px;top: 0;">
	       				<p>在校生<b>21.28</b>万人</p>
	       			</div>
       				<div style="position: absolute;left: 1055px;top: 0;">
	       				<p>在校生<b>16.02</b>万人</p>
	       				<p>初升高比例<b>99.02</b>%</p>
	       			</div>
       				<div style="position: absolute;left: 1390px;top: 0;">
	       				<p>在园幼儿<b>21.65</b>万人</p>
	       			</div>
       			</div>
       			
			</div>
			<div class="box-jy-bottom">
       			<div id="ech_n_10" style="height: 100%;"></div>
       			<img src="img/biaoshi1.png" style="position: absolute;left: 310px;bottom: 110px;" />
			</div>
		</div>
		<div class="box">
			<div class="bt">工业互联网平台</div>
			<img src="img/互联网平台.png" width="100%" style="margin-top: 20px;" />
		</div>
		<!-- <div class="box">
			<div class="bt">智慧交通</div>
			<div class="box-jt-left">
       			<div id="ech_n_1" style="height: 100%"></div>
			</div>
			<div class="box-jt-right">
				<div>
					<img src="img/jt1.png" />
					<p>货物周转量</p>
					<b>1814.32</b>
					<p>亿吨公里</p>
				</div>
				<div>
					<img src="img/jt2.png" />
					<p>旅客周转量</p>
					<b>75.28</b>
					<p>亿人公里</p>
				</div>
				<div>
					<img src="img/jt3.png" />
					<p>货物吞吐量</p>
					<b>7057</b>
					<p>万吨</p>
				</div>
				<div>
					<img src="img/jt4.png" />
					<p>外贸吞吐量</p>
					<b>753</b>
					<p>万吨</p>
				</div>
				<div>
					<img src="img/jt5.png" />
					<p>集装箱吞吐量</p>
					<b>21.3</b>
					<p>万标箱</p>
				</div>
				<div>
					<img src="img/jt6.png" />
					<p>民航旅客吞吐量</p>
					<b>1814.32</b>
					<p>万人次</p>
				</div>
				<div>
					<img src="img/jt7.png" />
					<p>民航货邮吞吐量</p>
					<b>1814.32</b>
					<p>吨</p>
				</div>
				<div>
					<img src="img/jt8.png" />
					<p>铁路发送旅客</p>
					<b>1814.32</b>
					<p>万人次</p>
				</div>
			</div>
		</div> -->
		<div class="box" style="background: url(img/智安小区.png) no-repeat;background-size: 100% 100%;">
		</div>
		<div class="box">
			<div class="bt">智安校园</div>
			<img src="img/智安校园.png" width="100%" height="95%" style="margin-top: 20px;" />
		</div>
		<div class="box">
			<div class="bt">智安企业</div>
			<div class="box-qy-left">
				<div class="box-qy-left-top">
       			<div style="height: 20%">
       				<p>质量强市和品牌战略成效明显</p>
       			</div>
       			<div id="ech_n_5" style="height: 70%"></div>
				</div>
				<div class="box-qy-left-bottom">
					<p>
						全市企业主导制（修）订国家标准<a>11</a>项，<br />
						主导制（修）订行业标准<a>10</a>项，<br />
						主导制定发布“浙江制造”标准<a>17</a>项。<br />
						全市有<a>547</a>家单位取得食品生产许可证。<br />
					</p>
				</div>
			</div>
			<div class="box-qy-right">
				<div>
					<p>检验机构</p>
					<p><i>128</i>家</p>
				</div>
				<div>
					<p style="font-size: 22px;">国家级检测中心</p>
					<p><i>2</i>家</p>
				</div>
				<div>
					<p>省质检中心</p>
					<p><i>12</i>家</p>
				</div>
				<div>
					<p>驰名商标</p>
					<p><i>57</i>家</p>
				</div>
				<div>
					<p>省著名商标</p>
					<p><i>360</i>家</p>
				</div>
				<div>
					<p style="font-size: 22px;">省级企业研究院</p>
					<p><i>86</i>家</p>
				</div>
				<div>
					<p style="font-size: 22px;">省级高新技术研发中心</p>
					<p><i>335</i>家</p>
				</div>
				<div>
					<p style="font-size: 22px;">国家重点扶持的高新技术企业</p>
					<p><i>586</i>家</p>
				</div>
				<div>
					<p style="font-size: 22px;">省级科技型中小企业</p>
					<p><i>3047</i>家</p>
				</div>
				<div>
					<p style="font-size: 22px;text-align: left;">市级以上众创空间<i style="font-size: 22px;">14</i>个,其中国家级<i style="font-size: 22px;">2</i>个，省级<i style="font-size: 22px;">5</i>个；</p>
				</div>
				<div style="width: 475px;background: url(img/bg4.png) no-repeat;">
					<p style="width: 65%;text-align: left;font-size: 22px;">全年申请专利<i>28071</i>件<br/>专利授权<i>19143</i>件<br/>其中发明<i>1844</i>件；</p>
				</div>
				<div style="width: 975px;background: url(img/bg5.png) no-repeat;">
					<p style="width: 80%;text-align: left;font-size: 23px;">规模以上高新技术产业增加值<i style="font-size: 30px;">458.15</i>亿元，比上年增长<i style="font-size: 30px;">16.7</i>%；<br/>全年共签订各类技术合同<i style="font-size: 30px;">1675</i>项，技术交易额<i style="font-size: 30px;">104.28</i>亿元。</p>
				</div>
			</div>
		</div>
		<div class="box">
			<div class="bt">智慧文旅</div>
			<img src="img/智慧文旅.png" width="100%" height="95%" style="margin-top: 20px;"/>
		</div>
		<div class="box">
			<div class="bt">智慧医疗</div>
			<img src="img/智慧医疗.png" width="100%" height="95%" style="margin-top: 20px;" />
		</div>
		<!--<div class="box">
			<div class="bt">智慧旅游</div>
			<div class="box-ly-left">
				<div class="box-ly-left-top">
					<p>2017年黄岩柔川、天台南屏景区成功创建国家4A级景区，临海桃渚景区列入国家级风景名胜区。</p>
					<p>全年共接待旅游总人数<i>10326.13</i>万人次，比上年增长<i>15.2</i>%，其中接待国内游客<i>10275.57</i>万人次，增长<i>15.3</i>%；</p>
					<p>实现旅游总收入<i>1133.34</i>亿元，增长<i>18.3</i>%，其中国内旅游收入<i>1109.98</i>亿元，增长<i>18.3</i>%。</p>
				</div>
				<div class="box-ly-left-bottom">
					<div>
						<img src="img/ly1.png" />
						<p style="font-size: 36px;color: #d9e249;">星级饭店</p>
						<p><i>54</i>家</p>
					</div>
					<div>
						<img src="img/ly2.png" />
						<p style="font-size: 36px;color: #4bbeed;">客房</p>
						<p><i>8041</i>家</p>
					</div>
					<div>
						<img src="img/ly3.png" />
						<p style="font-size: 36px;color: #d9e249;">床位</p>
						<p><i>13166</i>家</p>
					</div>
					<div>
						<img src="img/ly4.png" />
						<p style="font-size: 36px;color: #4bbeed;">旅行社</p>
						<p><i>157</i>家</p>
					</div>
					<div>
						<img src="img/ly5.png" />
						<p style="font-size: 36px;color: #d9e249;">星级旅行社</p>
						<p><i>56</i>家</p>
					</div>
				</div>
			</div>
			<div class="box-ly-right">
       			<div id="ech_n_2" style="height: 100%"></div>
			</div>
		</div>
		<div class="box">
			<div class="bt">智慧农业</div>
       		<div style="position: absolute; top: 225px;left:140px;font-size: 42px;font-weight: bold;">
       			<p>全市2017年农林牧渔业实现总产值475.49亿元，按可比价格计算，比上年增长2.4%。</p>
       		</div>
       		<a style="display:block;position: absolute; top: 287px;left:171px;height: 650px;border: 4px solid #ffffff;border-radius: 5px;z-index: 10;"></a>
			<div class="box-ny-left">
       			<div id="ech_n_4" style="height: 100%"></div>
			</div>
			<div class="box-ny-right-top">
       			<div id="ech_n_3" style="height: 100%"></div>
       			<div style="position: absolute; top: 65px; left: 100px;color: #1469dd;text-align: right;">
       				<p>粮食作物播种面积<br />98.99千公顷 45.9%</p>
       			</div>
       			<div style="position: absolute; top: 65px; left: 455px;color: #1469dd;text-align: right;">
       				<p>猪肉产量<br />8.93万吨</p>
       			</div>
       			<div style="position: absolute; top: 65px; left: 775px;color: #1469dd;text-align: right;">
       				<p>海洋捕捞产量<br />103.87万吨 </p>
       			</div>
       			<div style="position: absolute; top: 320px; left: 300px;color: #18efe8;">
       				<p>蔬菜作物播种面积<br />116.48千公顷 54.1%</p>
       			</div>
       			<div style="position: absolute; top: 320px; left: 675px;color: #18efe8;">
       				<p>禽蛋产量<br />2.78万吨</p>
       			</div>
       			<div style="position: absolute; top: 320px; left: 1030px;color: #18efe8;">
       				<p>海水养殖产量<br />49.93万吨</p>
       			</div>
			</div>
			<div class="box-ny-right-bottom">
				<div>
					<p>粮食</p>
					<img src="img/ny1.png" width="69px" />
					<a>63.75</a>
					<p>万吨</p>
				</div>
				<div>
					<p>蔬菜</p>
					<img src="img/ny2.png" width="69px" />
					<a>214.17</a>
					<p>万吨</p>
				</div>
				<div>
					<p>油料</p>
					<img src="img/ny3.png" width="69px" />
					<a>1.41</a>
					<p>万吨</p>
				</div>
				<div>
					<p>水果</p>
					<img src="img/ny4.png" width="69px" />
					<a>144.78</a>
					<p>万吨</p>
				</div>
				<div>
					<p>生猪出栏</p>
					<img src="img/ny5.png" width="69px" />
					<a>87.12</a>
					<p>万头</p>
				</div>
				<div>
					<p>家禽出栏</p>
					<img src="img/ny6.png" width="69px" />
					<a>1731.07</a>
					<p>万只</p>
				</div>
			</div>
		</div>-->
		
		<div class="box">
			<div class="bt">智慧园区</div>
			<img src="img/智慧园区.png" width="100%" height="95%" style="margin-top: 20px;" />
		</div>
		<!--<div class="box">
			<div class="bt">数字小微园</div>
			<div class="box-sz-left">
				<div class="box-sz-left-top">
					<div>
						<img src="img/biaoshi.png" />
						<p>应收<br /><a>0</a>元</p>
						<p>未收<br /><a>0</a>元</p>
					</div>
					<div>
						<img src="img/biaoshi.png" />
						<p>应收<br /><a>0</a>元</p>
						<p>未收<br /><a>0</a>元</p>
					</div>
					<div>
						<img src="img/biaoshi.png" />
						<p>应收<br /><a>764</a>元</p>
						<p>未收<br /><a>661</a>元</p>
					</div>
					<div>
						<img src="img/biaoshi.png" />
						<p>应收<br /><a>0</a>元</p>
						<p>未收<br /><a>0</a>元</p>
					</div>
				</div>
       			<div id="ech_n_6" style="height: 100%"></div>
			</div>
			<div class="box-sz-center">
				<div class="box-sz-center-top">
					<p>物业服务排名</p>
					<p>平均服务评价</p>
					<p>8.2</p>
					<div class="tab-body">
						<div class="tab-body-n1">NO.1 huifct 8.5</div>
						<div class="tab-body-n2">
							<dl class="barbox">
								<dd class="barline">
									<div class="charts" style="width:85%;">
										<a>85%</a>
									</div>
								</dd>
							</dl>
						</div>
						<div class="tab-body-n1">NO.2 microtest 7.25</div>
						<div class="tab-body-n2">
							<dl class="barbox">
								<dd class="barline">
									<div class="charts" style="width:72.5%;">
										<a>72.5%</a>
									</div>
								</dd>
							</dl>
						</div>
       					<div id="ech_n_11" style="width: 250px;height: 250px;position: absolute;top: 250px;left: 1070px;"></div>
						<p style="font-size: 24px;position: absolute;top: 490px;left: 1155px;">投诉率</p>
					</div>
				</div>
				<div class="box-sz-center-bottom">
					<div>
						<p>房间数量</p>
						<i>34</i>
					</div>
					<div>
						<p>已租房间</p>
						<i>3</i>
					</div>
					<div>
						<p>本年新增</p>
						<i>34</i>
					</div>
					<div>
						<p>本年退租</p>
						<i>0</i>
					</div>
					<div>
						<p>租用率</p>
						<i>8.82%</i>
					</div>
       				<div id="ech_n_7" style="width:572px;height: 320px"></div>
       				<img src="img/biaoshi2.png" width="450px" style="position: absolute;left: 860px;bottom: 145px;" />
				</div>
			</div>
			<div class="box-sz-right">
				<div class="box-sz-right-top">
					<div>
						<p>正常</p>
						<a style="background: #1469dd;"></a>
					</div>
					<div>
						<p>失联</p>
						<a style="background: #8ac22d;"></a>
					</div>
					<div>
						<p>未激活</p>
						<a style="background: #e6e636;"></a>
					</div>
					<div>
						<p>告警</p>
						<a style="background: #e40177;"></a>
					</div>
				</div>
       			<div id="ech_n_8" style="height: 80%;margin-top: 70px;"></div>
       			<div class="box-sz-right-bottom">
       				<p>智能安防</p>
       				<p>重点人员管控</p>
       				<p>吸毒人员：0</p>
       				<p>精神病人：0</p>
       				<p>吸毒人员：0</p>
       				<p>社区纠正人员：0</p>
       				<p>吸毒人员：0</p>
       				<p>重点少年：0</p>
       			</div>
			</div>
		</div>-->
            <!--<div class="box" style="padding:0;width:1920px;height:1080px;">
                <iframe  src="https://www.mtkjsoft.com/ksh.html" style="width:100%;height:100%"></iframe>
            </div>-->
	</div>
		

		<script type="text/javascript" src="js/echarts.min.js"></script>
		<script type="text/javascript" src="js/3x3-2.js"></script>
	<script>
			ech_n_1();
			ech_n_2();
			ech_n_3();
			ech_n_4();
			ech_n_5();
			ech_n_6();
			ech_n_7();
			ech_n_8();
			ech_n_9();
			ech_n_10();
			ech_n_11();

function ech_n_11(){
				$.ajax({
			        type: 'get',
			        url: "new_file.json",//请求数据的地址
			        dataType: "json",        //返回数据形式为json
			        success: function (result) {	
			    var myChart = echarts.init(document.getElementById("ech_n_11"));
				var data_dongtai = [{
				name: "幼儿园",
				value: 0,
				total:100
			}];
			var label_dongtai = [];
			for(var i = 0; i < data_dongtai.length; i++) {
				label_dongtai.push(data_dongtai[i].name);
			}
			
			option = {
				color:['#e40177', '#1469dd'],
				series: []
			};
			for(var i = 0; i < data_dongtai.length; i++) {
				option.series.push({
					type: 'pie',
					center: ['50%', '50%'],
					radius: ["60%", "80%"],
					hoverAnimation: false,
					label: {
						show: true,
						padding: [15, 0,0,0],
						position: 'center',
						formatter: function(val) { //让series 中的文字进行换行
							return "{a|"+val.value+"}"+"{b|%}";
						},
						rich:{
							a:{
						fontSize: 30,
						color:"#fff",
							},
							b:{
						fontSize: 30,
						color:"#fff",
							}
						}
					},
					x: '0%',
					data: [{
						name: data_dongtai[i].name,
						value: data_dongtai[i].value,
					}, {
						name: '',
						value: data_dongtai[i].total - data_dongtai[i].value,
						label: {show:false}
					}]
				}
				);
			};
			
			if (option && typeof option === "object") {
			    myChart.setOption(option, true);
			}
			        },
			    });
			
			}
		
	
			$(document).ready(function() {
				$.get('ajax.json',
					function(result) {
						if(result) {
							var data = result.Data;
							var btn = data.totalHuru;
							var html = '';
							html += '<div class="p1">封锁“圈”<p>' + data.quan + '</p></div><div class="p2">管控“块”<p>' + data.kuai + '</p></div><div class="p3">单元“格”<p>' + data.ge + '</p></div><div class="p4">轨迹“线”<p>' + data.xian + '</p></div><div class="p5">关键“点”<p>' + data.dian + '</p></div>';

							$(html).appendTo('#shuju');
						}
					});
			})
		</script>
	</body>

</html>